Website publication work flow

1. Edit Rmd

2. Knit to HTML to view progress. You may need to click “Open in Browser” for some content to show (sometimes content won’t show until you actually push your changes to GitHub and view the published website).

3. Commit and push changes when you are ready. The website may take a couple minutes to update automatically after the push, but you may need to clear your browser’s cache or view the page in a private/incognito window to see the changes more quickly.

You can include text, code, and output as usual. Remember to take full advantage of Markdown and follow our Style Guide.

Examples and additional guidance are provided below.

Take note of the the default code chunk options in the setup code chunk. For example, unlike the rest of the Rmd files we worked in this semester, the default code chunk option is echo = FALSE, so you will need to set echo = TRUE for any code chunks you would like to display in the blog. You should be thoughtful and intentional about the code you choose to display.

Visualizations

Visualizations, particularly interactive ones, will be well-received. That said, do not overuse visualizations. You may be better off with one complicated but well-crafted visualization as opposed to many quick-and-dirty plots. Any plots should be well-thought-out, properly labeled, informative, and visually appealing.

If you want to include dynamic visualizations or tables, you should explore your options from packages that are built from htmlwidgets. These htmlwidgets-based packages offer ways to build lighterweight, dynamic visualizations or tables that don’t require an R server to run! A more complete list of packages is available on the linked website, but a short list includes:

• plotly: Interactive graphics with D3
• leaflet: Interactive maps with OpenStreetMap
• dygraphs: Interactive time series visualization
• visNetwork: Network graph visualization vis.js
• sparkline: Small inline charts
• threejs: Interactive 3D graphics

You may embed a published Shiny app in your blog if useful, but be aware that there is a limited window size for embedded objects, which tends to makes the user experience of the app worse relative to a dedicated Shiny app page. Additionally, Shiny apps will go idle after a few minutes and have to be reloaded by the user, which may also affect the user experience.

Any Shiny apps embedded in your blog should be accompanied by the link to the published Shiny app (I did this using a figure caption in the code chunk below, but you don’t have to incorporate the link in this way).

Tables

library(DT)
mtcars %>% 
  select(mpg, cyl, hp) %>% 
  datatable(colnames = c("MPG", "Number of cylinders", "Horsepower"),
            filter = 'top',
            options = list(pageLength = 10, autoWidth = TRUE))

library(kableExtra)
summary(cars) %>%
  kbl(col.names = c("Speed", "Distance"),
      row.names = FALSE) %>%
  kable_styling(bootstrap_options = "striped",
                full_width = FALSE) %>%
  row_spec(0, bold = TRUE) %>%
  column_spec(1:2, width = "1.5in") 

Images

Images and gifs can be displayed using code chunks:

“Safe Space” by artist Kenesha Sneed

This is a figure caption

You may also use Markdown syntax for displaying images as shown below, but code chunks offer easier customization of the image size and alignment.

This is another figure caption

Either way, the file path can be a local path within your project directory or a URL for an image hosted online. This syntax works for PNG, PDF, JPG, and even GIF formats.

Videos

You can use code chunks or Markdown syntax include links to any valid YouTube or Vimeo URLs (see here for details) or point to a location within your project directory.

Code chunk:

Markdown syntax:

You may need to push your updates to GitHub to see if the videos work.

Equations

You might include equations if part of the purpose of your blog is to explain a statistical method. There are two ways to include equations:

• Inline: \(b \sim N(0, \sigma^2_b)\)
• Display-style (displayed on its own line): \[\frac{\sigma^2_b}{\sigma^2_b + \sigma^2_e}\]

For typesetting equations appropriately, check out the AMS-LaTeX quick reference or take a look at the Symbols in math mode section of this cheat sheet (or do some extra Googling—there are many resources).

Column formatting

Theme

You can use the rmdformats package to play around with some pre-built themes. There are, I’m sure, many many many more similar packages with built in themes, or you can look into how to include a CSS code chunk to customize aspects of a theme.

Using the rmdformats package, you can change the theme itself (Line 6):

• rmdformats::readthedown
• rmdformats::downcute
  • For downcute only, you can add a new indented line below Line 6 with the code downcute_theme: "chaos" for the downcute chaos theme
• rmdformats::robobook
• rmdformats::material

You can explore additional YAML options by looking at the rmdformats package page or running, for example, ?rmdformats::readthedown() to see the help documentation for a particular theme from the package.

Synax highlighting

You can also change the code chunk syntax highlighting option (Line 7, highlight):

• "default"
• "tango"
• "pygments"
• "kate"
• "monochrome"
• "espresso"
• "zenburn"
• "haddock"
• "textmate"
• NULL for no syntax highlighting (not recommended)

Font size, type, and other customization

Further customization requires adding a CSS style file or code chunk or incorporating other development options. Customization beyond the rmdformats package should be your lowest and final priority for the project. Ensure your content is fully prepared first.